<%#
    Auth: Wen
    Version: V1.0
    Data: 2019.8.20
    Function:
%>
<%+header%>
	<!DOCTYPE html>
	<html>
	<head>
		<meta charset="utf-8">
		<title>第一个 ECharts 实例</title>
		<!-- 引入 echarts.js -->
		<script src="<%=resoucres%>/luci-static/resources/echarts.min.js"></script>
	</head>
	<body>
		<!-- 为ECharts准备一个具备大小（宽高）的Dom -->

		<div id="agc_heading_line" style="width:600px;height:400px;" value="1"></div>
		<div id="" style="width:600px;height: 300px;">
		<p><span style="display:inline-block;width:200px;text-align:right;"><%:Set Heading Zero:%></span> <input type="number" min="0.0" max="359.0" step="0.1" id="heading_zero"/> <%:Range%>:0~359.0 &#176</p>
		<p><span style="display:inline-block;width:200px;text-align:right;"><%:Set Pre Azi Zero:%></span> <input type="number" min="0.0" max="359.0" step="0.1" id="pre_azimuth_zero"/> <%:Range%>:0~359.0 &#176</p>
		<p><span style="display:inline-block;width:200px;text-align:right;"><%:Set Cur Azi Zero:%></span> <input type="number" min="0.0" max="359.0" step="0.1" id="cur_azimuth_zero"/> <%:Range%>:0~359.0 &#176</p>
		<input id="calibration" class="btn btn-success" type="button" value="<%:calibration%>" style="margin-left: 100px;" onclick="set_heading_azi()">
		<input id="refresh" class="btn btn-success" type="button" value="<%:refresh chart%>" style="margin-left: 5px;" onclick="get_heading_snr()">
		<input id="clear" class="btn btn-primary" type="button" value="<%:clear chart%>"  style="margin-left: 5px;"onclick="clear_heading_snr()">
		</div>
		<script type="text/javascript">
			var heading_agc_xhr = new XHR();

			var heading_agc_line = [];
			var heading_agc_str;

			//初始化echarts对象
			var agc_heading_chart_line = echarts.init(document.getElementById('agc_heading_line'));
			//配置echarts配置项
			option_agc_line = {
				title: {
					text: '<%:SNR and heading angle relationship diagram%>'
				},
				tooltip: {
					trigger: 'axis',
					axisPointer: {
						type: 'cross'
					}
				},
				dataZoom: [{
						show: true,
						realtime: true,
						start: 0,
						end: 100
					},
					{
						type: 'inside',
						realtime: true,
						start: 0,
						end: 100
					}],
				xAxis: {
					type: 'category',
					name: '<%:heading angle%>(°)',
					splitLine: {
						show: true
					},
					boundaryGap: false,
					axisPointer: {
						snap: true,
					},
				},
				yAxis: {
					type: 'value',
					name: '<%:SNR%>(dB)',
					boundaryGap: false,
					splitLine: {
						show: true
					},
					min: 0,
					max: 20
				},
				series: [{
					name: '<%:SNR%>',
					type: 'line',
					showSymbol: true,
					hoverAnimation: true,
					//data: heading_agc_line,
					areaStyle: {}
				}]
			};
			agc_heading_chart_line.setOption(option_agc_line);
			//将xhr.post修改为同步通信模式
			function post_ajax_false(url,data,callback)
			{
				heading_agc_xhr.reinit();

				var xhr  = heading_agc_xhr._xmlHttp;
				var code = heading_agc_xhr._encode(data);

				xhr.onreadystatechange = function()
				{
					if (xhr.readyState == 4)
						callback(xhr);
				}
				//false: 同步通信  true: 异步通信
				xhr.open('POST', url, false);
				xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
				//removed by zhangleyi because of webit security reasons
				//xhr.setRequestHeader('Content-length', code.length);
				//xhr.setRequestHeader('Connection', 'close');
				xhr.send(code);
			}
			//刷新初始化图表
			function init()
			{
				for(var i = 2; i < 362; i++)
				{
					heading_agc_line.push([0, 0]);
				}
			}
			//刷新图表
			function get_heading_snr()
			{
				//获取数据，由于要求特殊，必须将异步通信的方式更改为同步通信才能正常使用
				post_ajax_false('<%=controller%>admin/ACU_Antenna/refreshBlock', {token:'<%=token%>'}, function(x){
					heading_agc_str = x.responseText;
				})

				var str1 = heading_agc_str.split(",");
				for(var i = 2; i < 362; i++)
				{
					heading_agc_line.shift();
					heading_agc_line.push([i-2, parseInt(str1[i]) / 10]);
				}
				
				agc_heading_chart_line.setOption({
					series: [{
						data: heading_agc_line
					}]
				});
			}
			//清空图表
			function clear_heading_snr()
			{
				//调用指令清空后台数据
				heading_agc_xhr.post('<%=controller%>admin/ACU_Antenna/clearBlock', {token:'<%=token%>'}, function(x){});
				//清空前端数据
				for(var i = 2; i < 362; i++)
				{
					heading_agc_line.shift();
					heading_agc_line.push([i - 2, 0]);
				}
				agc_heading_chart_line.setOption({
					series: [{
						data: heading_agc_line
					}]
				});
			}
			//获取当前设置航向角，当前方位角零位，预设方位角零位
			function get_heading_azi()
			{
				heading_agc_xhr.post('<%=controller%>admin/ACU_Antenna/getHeadingAzi', {token:'<%=token%>'}, function(x){
						var n = x.responseText.split(",");

						if(n != null)
						{
							var y = n[4].split("*");
							document.getElementById("heading_zero").value = n[2];
							document.getElementById("cur_azimuth_zero").value = n[3]; 
							document.getElementById("pre_azimuth_zero").value = y[0]; 
						}
						else
						{
							document.getElementById("heading_zero").value = 0;
							document.getElementById("cur_azimuth_zero").value = 0; 
							document.getElementById("pre_azimuth_zero").value = 0; 
						}

				});

			}
			//设置航向角，当前方位角零位，预设方位角零位
			function set_heading_azi()
			{
				var heading = document.getElementById("heading_zero").value;
				var cur_azimuth = document.getElementById("cur_azimuth_zero").value;
				var pre_azimuth = document.getElementById("pre_azimuth_zero").value;
				heading_agc_xhr.post('<%=controller%>admin/ACU_Antenna/setHeadingAzi', {token:'<%=token%>', para1: heading, para2: cur_azimuth, para3: pre_azimuth}, function(x){});
			}
			init();
			get_heading_azi();
			get_heading_snr();
		</script>

	</body>
	</html>
<%+footer%>